<div class="layui-card layadmin-header">
  <div class="layui-breadcrumb" lay-filter="breadcrumb">
    <a lay-href="">主页</a>
    <a><cite>风险订单列表</cite></a>
    <a><cite>此列表显示近一个小时内频繁拉起且未支付的订单</cite></a>
  </div>
</div>
<div class="layui-fluid">
  <div class="layui-card">
    <div class="layui-tab layui-tab-brief">
      <div class="layui-tab-content">
        <div class="layui-tab-item layui-show">
          <table id="Code_Order_dataAll" lay-filter="Code_Order_dataAll"></table>
        </div>
      </div>
    </div>
  </div>
</div>
<style>
  .imgDiv {
    width: 500px;
    height: 500px;
    vertical-align: middle;
    display: table-cell;
    text-align: center;
  }
</style>
<script type="text/html" id="operateBar">
  <a class="layui-btn layui-btn-xs layui-btn-primary" title="点击查看二维码" lay-event="viewQr"><i class="layui-icon">&#xe64a;</i></a>
</script>

<script>
layui.use(['admin', 'table', 'util', 'laydate'], function(){
  var $ = layui.$
  ,admin = layui.admin
  ,table = layui.table
  ,element = layui.element
  ,form = layui.form;

  element.render('breadcrumb', 'breadcrumb');

  var tplStatus = function (d) {
    if(d.status == 0) {
      return "<span style='color: yellowgreen'>订单生成</span>";
    }else if(d.status == 1) {
      return "<span style='color: orangered'>支付中</span>";
    }else if(d.status == 2) {
      return "<span style='color: blueviolet'>支付成功</span>";
    }else if(d.status == 3) {
      return "<span style='color: blue'>处理完成</span>";
    }else if(d.status == -1) {
      return "<span style='color: darkred'>支付失败</span>";
    }else if(d.status == -2) {
      return "<span style='color: red'>订单过期</span>";
    }
  };

  var tplPhase = function (d) {
    if(d.operatePhase == 0) {
      return "生成订单";
    }else if(d.operatePhase == 1) {
      return "进入订单页";
    }else if(d.operatePhase == 2) {
      return "点击跳转";
    }else if(d.operatePhase == 3) {
      return "扫码";
    }else if(d.operatePhase == 4) {
      return "进入app";
    }else if(d.operatePhase == 5) {
      return "转账";
    }
  };

  table.render({
    elem: '#Code_Order_dataAll'
    ,url: layui.setter.baseUrl + '/code/order/risk'
    ,where: {
        access_token: layui.data(layui.setter.tableName).access_token
    }
    ,id: 'tableReload'
    ,initSort: {
      field: 'ipNum'
      ,type: 'desc'
    }
    ,page: false
    ,cols: [[
      {field: 'codeBusId', title: '码商ID', width: 75}
      ,{field: 'clientIp', title: '客户IP', width: 140}
      ,{field: 'ipNum', title: '订单数', width: 80}
      ,{field: 'orderNo', title: '订单号', width: 190}
      ,{field: 'mchOrderNo', title: '商户订单号', width: 200}
      ,{field: 'codeName', title: '收款账户'}
      ,{field: 'amount', title: '金额'}
      ,{field: 'status', title: '状态', templet: tplStatus}
      ,{field: 'operatePhase', title: '操作阶段', templet: tplPhase, width: 100}
      ,{field: 'weight', title: '时间', templet: '<div>{{ layui.util.toDateString(d.createTime, "HH:mm:ss") }}</div>'}
      ,{field: 'edit', title: '操作', width: 60, toolbar: '#operateBar' }
    ]]
    ,skin: 'line'
  });

  //监听工具条
  table.on('tool(Code_Order_dataAll)', function (obj) {
    var data = obj.data;
    if (obj.event === 'viewQr') {
      var codeUrl = "";
      admin.req({
        type: 'get',
        url: layui.setter.baseUrl + '/code/qr/view',
        data: {
          id: data.codeId,
        },
        success: function (res) {
          if (res.code == 0) {
            codeUrl = res.data;
            layer.open({
              type: 1,
              title: '查看二维码',
              area: ['500px', '550px'],
              shadeClose: true,
              content: '<div class="imgDiv"><img style="width:80%;height:80%;" src="' + codeUrl + '"></div>'
            });
          }
        }
      });
    }
  });

  // 渲染表单
  form.render();
});
</script>